<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="${params.contextPath}/common/ztree/css/zTreeStyle/zTreeStyle.css"/>
<title>档案分类列表</title> <#include "/common/resource.ftl">
<script type="text/javascript" src="${params.contextPath}/common/ztree/js/jquery.ztree.all.min.js"></script>
</head>
<body>
	<table class="ui-table">
		<tr>
			<td class="ui-table-left">
				<!-- ** 左侧栏 ** -->
				<div class="ui-head">
					<span>档案分类结构树</span> <span class="right"> <i
						class="fa fa-remove"></i>&nbsp;取消选中
					</span>
				</div>
				<div class="ui-body">
					<ul id="treeDemo" class="ztree"></ul>
				</div>
			</td>
			<td class="ui-table-right" >
				

				<div class="ui-operation">

					<div class="ui-buttons">
						<div class="layui-btn-group tools">
							<button class="layui-btn layui-btn-normal add-dialog" p="url:'${params.contextPath}/view/icip/archives/archives_category_edit.htm',title:'添加档案',width:'800px',height:'90%'">
								<i class="fa fa-plus"></i>添加
							</button>
							<button class="layui-btn layui-btn-normal singleSelected" p="url:'${params.contextPath}/view/icip/archives/archives_category_edit.htm',title:'编辑档案',width:'800px',height:'90%'">
								<i class="fa fa-pencil"></i>修改
							</button>
							<button class="layui-btn layui-btn-normal remove-button" reurl="${params.contextPath}/web/archivesCategory/delete.json">
								<i class="fa fa-remove"></i>删除
							</button>
							<button class="layui-btn layui-btn-normal  accept-button" reurl="${params.contextPath}/web/archivesCategory/accpet.json">
								<i class="fa fa-play"></i>启用
							</button>
							<button class="layui-btn layui-btn-normal  stop-button" reurl="${params.contextPath}/web/archivesCategory/stop.json">
								<i class="fa fa-stop"></i>停用
							</button>
						</div>
						<div class="ui-searchs">
							<div class="value" style="">
								<input type="text" placeholder="名称" name="searchInput" value="" />
								<input type="hidden" name="parentId" value=""/>
							</div>
							<input type="button" value="搜索" class="layui-btn layui-btn-danger search-button" />
						</div>
					</div>
				</div>
				<div class="ui-content" style="padding-left: 10px;padding-right:10px;">
					<table id="datagrid"  options="url:'${params.contextPath}/web/archivesCategory/list.json',params:'getSearchParams'">
						<thead>
							<tr>
								<th data-options="field:'ck',checkbox:true"></th>
								<th data-options="field:'name',width:150,align:'left'">分类名称</th>
								<th data-options="field:'ordernum',width:80,align:'left'">排列序号</th>
 								<th data-options="field:'remark',width:80,align:'left'">说明</th>
 								<th data-options="field:'createTimeStr',width:150,align:'center'">创建时间</th>
  								<th data-options="field:'stateStr',width:80,align:'center',formatter:formatState">状态</th>
 							</tr>
						</thead>
					</table>
				</div>
			</td>
		</tr>
	</table>
</body>
 <script type="text/javascript">
        var getSearchParams = function(){
            return {
                searchInput:$("input[name='searchInput']").val() || "",
                parentId:$("input[name='parentId']").val() || "",
            };
        }
        function formatState(val,row){
    		if (row.state == 1) {
    			return '<span class="ui-accept">' + val + '</span>';
    		} else {
    			return '<span class="ui-stop">' + val + '</span>';
    		}
    	}
        function treeClick(event, treeId, treeNode, clickFlag) {
            $("input[name='parentId']").val(treeNode.id);
            DataGrid.refresh();
        }
        function beforeDrop(treeId, treeNodes, targetNode, moveType, isCopy) {
            var success = false;
            $.ajaxRequest({
                url:"${params.contextPath}/web/archivesCategory/drag.json",
                data:{id:treeNodes[0].id, targetId:targetNode.id},
                async:false,
                success:function (data) {
                    if (!data.success) {
                        $.message("拖拽失败");
                        return;
                    }
                    $.message(data.message);
                    success = true;
                }
            });
            return success;
        }

        var setting = {
            data: {simpleData: {enable: true}},
            edit: {
                drag: {autoExpandTrigger: true},
                enable: true,
                showRemoveBtn: false,
                showRenameBtn: false
            },
            callback:{onClick:treeClick,beforeDrop:beforeDrop}
        };
        var initTree = function () {
            $.ajaxRequest({
                url:"${params.contextPath}/web/archivesCategory/tree.json",
                success:function (data) {
                    if (!data.success) {
                        $.message(data.message);
                        return;
                    }
                    var zTree = $.fn.zTree.init($("#treeDemo"), setting, data.data);
                    var nodes = zTree.transformToArray(zTree.getNodes());
                    zTree.expandNode(nodes[0], true);
                }
            });
        };

        
        $(document).ready(function(){
            initTree();
            $(".add-dialog").click(function () {
                var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                var nodes = treeObj.getSelectedNodes();
                if (nodes.length <= 0) {
                    var p = $(this).attr("p");
                    DialogManager.openDialog(p);
                    return;
                }
                var parentId = nodes[0].id;
                var p = $(this).attr("p");
                var params = eval("({" + p + "})");
                params.url += "?parentId="+parentId + "&parentName=" + nodes[0].name;
                DialogManager.openDialog(JSON.stringify(params).replace("{", "").replace("}", ""));
            });
            $(".ui-head .right").click(function(){
                var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                treeObj.cancelSelectedNode();
                $("input[name='parentId']").val("");
                DataGrid.refresh();
            });
        });
        
        $(function(){
    		$(".remove-button").click(function() {
    			var ids = DataGrid.getCheckedIds();
    			if (ids == "") {
    				layer.msg("请选择删除记录")
    				return false;
    			}
    			var url = $(this).attr("reurl");
    			layer.confirm('确定删除记录', function() {
    				$.ajaxRequest({
    					url : url,
    					data : {
    						ids : ids.join(",")
    					},
    					success : function(data) {
    						$.message(data.message);
    						if (data.success) {
    							DataGrid.reload();
    						}
    					}
    				});
    			});
    		});
    		$(".accept-button").click(function() {
    			var ids = DataGrid.getCheckedIds();
    			if (ids == "") {
    				layer.msg("请选择启用区域")
    				return false;
    			}
    			var url = $(this).attr("reurl");
    			$.ajaxRequest({
    				url : url,
    				data : {
    					ids : ids.join(",")
    				},
    				success : function(data) {
    					$.message(data.message);
    					if (data.success) {
    						DataGrid.reload();
    					}
    				}
    			});
    		});
    		$(".stop-button").click(function(){
    			var ids = DataGrid.getCheckedIds();
    			if (ids == "") {
    				layer.msg("请选择停用区域")
    				return false;
    			}
    			var url = $(this).attr("reurl");
    			$.ajaxRequest({
    				url : url,
    				data : {
    					ids : ids.join(",")
    				},
    				success : function(data) {
    					$.message(data.message);
    					if (data.success) {
    						DataGrid.reload();
    					}
    				}
    			});
    		});
        })
    </script>
</html>
